<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core">
<h:head>
	<title>PrimeFaces Slider</title>
</h:head>
<h:body>

	<h:form>
		<h3 style="margin-top: 0">Configurateur des serveurs Cloud</h3>
		<p:tabView>
			<p:tab title="Serveurs Cloud">
				<h:panelGrid columns="2" cellpadding="5">

					<h3>VM</h3>
					<h:inputHidden id="nbvm" value="#{configuratorBean.nbvm}" />
					<p:slider id="slidervm" for="nbvm" display="output"
						style="width: 200px">
						<p:ajax event="slideEnd"
							listener="#{configuratorBean.onSlideEndVM}" update="nbvm" />
					</p:slider>
					<h:outputText id="output" value="#{configuratorBean.nbvm}" />

					<h3>Taille</h3>
					<h:inputHidden id="nbtaille" value="#{configuratorBean.nbtaille}" />
					<p:slider id="slidertaille" for="nbtaille"
						step="#{configuratorBean.steptaille}" style="width: 200px">
						<p:ajax event="slideEnd"
							listener="#{configuratorBean.onSlideEndTaille}"
							update="outputtaille" />
					</p:slider>
					<h:outputText id="outputtaille"
						value="#{configuratorBean.outputtaille}" />

					<h3>Disponibilité</h3>
					<h:inputHidden id="nbdispo" value="#{configuratorBean.nbdispo}" />
					<p:slider id="sliderdispo" for="nbdispo"
						step="#{configuratorBean.stepdispo}" style="width: 200px">
						<p:ajax event="slideEnd"
							listener="#{configuratorBean.onSlideEndDispo}"
							update="outputdispo sliderbp outputbp nbbp" />
					</p:slider>
					<h:outputText id="outputdispo"
						value="#{configuratorBean.outputdispo}" />

					<h3>Bande Passante</h3>
					<h:inputHidden id="nbbp" value="#{configuratorBean.nbbp}" />
					<p:slider id="sliderbp" for="nbbp"
						step="#{configuratorBean.stepbp}" style="width: 200px">
						<p:ajax event="slideEnd" listener="#{configuratorBean.onSlideEndBP}"
							update="outputbp" />
					</p:slider>
					<h:outputText id="outputbp" value="#{configuratorBean.outputbp}" />
					

				</h:panelGrid>
			</p:tab>
		</p:tabView>
	</h:form>

</h:body>
</html>